$(function () {
    //时间切换监听器
    document.getElementById("trade-time-type").addEventListener("statistics-time",function (evt) {
        tradePayOrderNumList(evt.detail.type,evt.detail.startTime,evt.detail.endTime);
    });
    //交易额度与订单量分布监听器
    document.getElementById("spread-time-type").addEventListener("statistics-time",function (evt) {
        queryOrderTradeSpreadList(evt.detail.type,evt.detail.startTime,evt.detail.endTime);
    });

    //所有交易支付方式
    document.getElementById("pay-time-type").addEventListener("statistics-time",function (evt) {
        queryOrderPayTypeOrderNum(evt.detail.type,evt.detail.startTime,evt.detail.endTime);
    });

    //所有交易支付方式
    document.getElementById("form-time-type").addEventListener("statistics-time",function (evt) {
        queryPayOrderFormNumData(evt.detail.type,evt.detail.startTime,evt.detail.endTime);
    });

    //初始化基础数据中的时间筛选
    initTimeType("trade-time-type");
    //交易额度与订单量分布
    initTimeType("spread-time-type");
    //所有交易支付方式
    initTimeType("pay-time-type");
    //交易支付渠道
    initTimeType("form-time-type");

    //初始化时间控件
    initTime("statTimeLaydate","endTimeLaydate",'trade-time-type');
    //订单量分布时间控件
    initTime("spreadStatTimeLaydate","spreadEndTimeLaydate",'spread-time-type');
    //所有交易支付方式
    initTime("payStatTimeLaydate","payEndTimeLaydate",'pay-time-type');
    //交易支付渠道
    initTime("formStatTimeLaydate","formEndTimeLaydate",'form-time-type');

    //交易数据
    tradePayOrderNumList(2,null,null);
    //交易额度与订单量分布
    queryOrderTradeSpreadList(2,null,null);
    //交易支付方式
    queryOrderPayTypeOrderNum(2,null,null);
    //交易支付渠道
    queryPayOrderFormNumData(2,null,null);

    /**
     * 获取交易数据统计
     * @param type 时间类型，1=今日实时，2=近7天（不包含当天），3=近30天（不包含当天），4=自定义（只可选当天之前的时间，且时间跨度不超过12月）
     * @param startTime 开始时间
     * @param endTime 结果时间
     */
    function tradePayOrderNumList(type,startTime,endTime) {
        $.ajax({
            url: baseloaction + '/admin/stat/tradePayOrderNumList',
            type:'post',
            dataType:'json',
            data:{
                'type':type,
                'startTime':startTime,
                'endTime':endTime
            },
            beforeSend:function(XH){
                $("#trade-loading-box").removeClass("hide");
                return true;
            },
            success:function (result) {
                initTradeECharts(result)
                $("#trade-loading-box").addClass("hide");
            }
        });
    }

    function showNum(id,num) {
        if(num > 9999){
            num = parseFloat(num / 10000).toFixed(2);
            $("#"+id).next().removeClass('hide');
        }else{
            if(num <=0){
                num = '--';
            }
        }
        $("#"+id).text(num);
    }

    /**
     * 交易数据统计图初始化
     * @param result 返回结果
     */
    function initTradeECharts(result) {
        //视频课
        var videoOrderNum = result.videoOrderNum;
        showNum("videoOrderNum",videoOrderNum);

        //专栏课
        var columnsOrderNum = result.columnsOrderNum;
        showNum("columnsOrderNum",columnsOrderNum);

        //套餐课
        var packageOrderNum = result.packageOrderNum;
        showNum("packageOrderNum",packageOrderNum);

        //直播课
        var liveOrderNum = result.liveOrderNum;
        showNum("liveOrderNum",liveOrderNum);

        //试卷
        var examOrderNum = result.examOrderNum;
        showNum("examOrderNum",examOrderNum);

        //图书
        var bookOrderNum = result.bookOrderNum;
        showNum("bookOrderNum",bookOrderNum);

        //会员
        var memberOrderNum = result.memberOrderNum;
        showNum("memberOrderNum",memberOrderNum);

        //问答
        var qaOrderNum = result.qaOrderNum;
        showNum("qaOrderNum",qaOrderNum);

        //问答围观
        var attendOrderNum = result.attendOrderNum;
        showNum("attendOrderNum",attendOrderNum);

        //====================================
        var dataList = result.entity;
        var xList = new Array();

        var videoOrderNum = new Array();
        var columnsOrderNum = new Array();
        var packageOrderNum = new Array();
        var liveOrderNum = new Array();
        var examOrderNum = new Array();
        var bookOrderNum = new Array();
        var memberOrderNum = new Array();
        var qaOrderNum = new Array();
        var attendOrderNum = new Array();

        $.each(dataList,function (index,data) {
            videoOrderNum.push(data.videoOrderNum);
            columnsOrderNum.push(data.columnsOrderNum);
            packageOrderNum.push(data.packageOrderNum);
            liveOrderNum.push(data.liveOrderNum);
            examOrderNum.push(data.examOrderNum);
            bookOrderNum.push(data.bookOrderNum);
            memberOrderNum.push(data.memberOrderNum);
            qaOrderNum.push(data.qaOrderNum);
            attendOrderNum.push(data.attendOrderNum);
            if(result.type==1){//当天
                xList.push(data.countTime.split(":")[0]);
            }else{//历史数据
                xList.push(data.countTime.split(" ")[0]);
            }
        });
        var opEChart = echarts.init(document.getElementById("trade-statistic-box"));
        var colors =[
            "#1890ff",
            "#2fc25b",
            "#fbd44b",
            "#f4667c",
            "#47D8BE",
            "#8d7fec",
            "#3A5FCD",
            "#FFA54F",
            "#30cdf0"

        ];

        var option = {
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data:['录播','专栏','套餐','直播','试卷','图书','会员','问答','问答围观']
            },
            grid: {
                top: 'middle',
                left: '3%',
                right: '4%',
                bottom: '3%',
                height: '80%',
                containLabel: true
            },
            xAxis: {
                type: 'category',
                data: xList,
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    }
                }
            },
            yAxis: {
                type: 'value',
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: '#DDD'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    },
                    onZero: false,
                },
                axisTick: {
                    alignWithLabel: true
                },
                nameTextStyle: {
                    color: "#999"
                },
                splitArea: {
                    show: false
                }
            },
            series: [
                {
                    name:'录播',
                    type:'line',

                    data:videoOrderNum,
                    color: colors[0],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[0] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[0],
                            borderWidth: 7,
                            borderColor:colors[0]
                        }
                    },
                    smooth: true
                },
                {
                    name:'专栏',
                    type:'line',
                    data:columnsOrderNum,
                    color: colors[1],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[1] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[1],
                            borderWidth: 7,
                            borderColor:colors[1]
                        }
                    },
                    smooth: true
                },
                {
                    name:'套餐',
                    type:'line',
                    data:packageOrderNum,
                    color: colors[2],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[2] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[2],
                            borderWidth: 7,
                            borderColor:colors[2]
                        }
                    },
                    smooth: true
                },
                {
                    name:'直播',
                    type:'line',
                    data:liveOrderNum,
                    color: colors[3],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[3] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[3],
                            borderWidth: 7,
                            borderColor:colors[3]
                        }
                    },
                    smooth: true
                },
                {
                    name:'试卷',
                    type:'line',
                    data:examOrderNum,
                    color: colors[4],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[4] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[4],
                            borderWidth: 7,
                            borderColor:colors[4]
                        }
                    },
                    smooth: true
                },
                {
                    name:'图书',
                    type:'line',
                    data:bookOrderNum,
                    color: colors[5],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[5] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            },
                            shadowColor: 'rgba(245,128,128, 0.5)',
                            shadowBlur: 7,
                            shadowOffsetY: 4
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[5],
                            borderWidth: 7,
                            borderColor:colors[5]
                        }
                    },
                    smooth: true
                },
                {
                    name:'会员',
                    type:'line',
                    data:memberOrderNum,
                    color: colors[6],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[6] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[6],
                            borderWidth: 7,
                            borderColor:colors[6]
                        }
                    },
                    smooth: true
                },
                {
                    name:'问答',
                    type:'line',
                    data:qaOrderNum,
                    color: colors[7],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[7] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[7],
                            borderWidth: 7,
                            borderColor:colors[7]
                        }
                    },
                    smooth: true
                },
                {
                    name:'问答围观',
                    type:'line',
                    data:attendOrderNum,
                    color: colors[8],
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[8] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[8],
                            borderWidth: 7,
                            borderColor:colors[8]
                        }
                    },
                    smooth: true
                }
            ]
        };
        opEChart.setOption(option);
        $(window).resize(opEChart.resize);
    }

    /**
     * 交易额度与订单量折线图 （交易额度为维度、订单量为经度）
     */
    function queryOrderTradeSpreadList(type,startTime,endTime) {
        setTimeout(function () {
            $.ajax({
                url: baseloaction + '/admin/stat/queryOrderTradeSpreadList',
                type:'post',
                dataType:'json',
                data:{
                    'type':type,
                    'startTime':startTime,
                    'endTime':endTime
                },
                beforeSend:function(XH){
                    $("#trade-spread-loading-box").removeClass("hide");
                    return true;
                },
                success:function (result) {
                    initOrderTradeSpreadECharts(result);
                    $("#trade-spread-loading-box").addClass("hide");
                }
            });
        },400);
    }

    /**
     * 初始化交易额度与订单量分布图片
     * @param result
     */
    function initOrderTradeSpreadECharts(result) {
        var orderCountList = new Array();
        var xList = new Array();
        $.each(result.entity,function (index,obj) {
            xList.push(obj.showName);
            orderCountList.push(obj.orderNum);
        });
        var orderTradeSpreadEChart = echarts.init(document.getElementById("spread-statistic-box"));
        var colors = ['#1890ff'];
        var option = {
            color: colors[0],
            tooltip: {
                trigger: 'axis'
            },

            legend: {
                data:[ '交易额度与订单量折线图']
            },
            grid: {
                top: 'middle',
                left: '3%',
                right: '4%',
                bottom: '3%',
                height: '80%',
                containLabel: true
            },
            xAxis: [
                { type: 'category',
                    axisTick: {
                        alignWithLabel: true
                    },
                    axisLine: {
                        onZero: false,
                        lineStyle: {
                            color: "#333"
                        }
                    },
                    axisPointer: {
                        label: {
                            formatter: function (params) {
                                return '订单量  ' + params.value
                                    + (params.seriesData.length ? '：' + params.seriesData[0].data : '') +"单";
                            }
                        }
                    },
                    data: xList
                }
            ],
            yAxis: {
                type: 'value',
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: '#DDD'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    },
                    onZero: false,
                },
                axisTick: {
                    alignWithLabel: true
                },
                nameTextStyle: {
                    color: "#999"
                },
                splitArea: {
                    show: false
                }
            },
            series: [
                {
                    name:'订单统计图',
                    type:'line',
                    smooth: true,
                    data: orderCountList,
                    lineStyle: {
                        normal: {
                            width: 3,
                            color: {
                                type: 'linear',

                                colorStops: [{
                                    offset: 1,
                                    color: colors[0] // 0% 处的颜色
                                }],
                                globalCoord: false // 缺省为 false
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: colors[0],
                            borderWidth: 7,
                            borderColor:colors[0]
                        }
                    },
                    smooth: true
                }
            ]
        };
        orderTradeSpreadEChart.setOption(option);
        $(window).resize(orderTradeSpreadEChart.resize);
    }

    /**
     * 交易支付方式比例
     */
    function queryOrderPayTypeOrderNum(type,startTime,endTime) {
        $.ajax({
            url: baseloaction + '/admin/stat/queryOrderPayTypeOrderNum',
            type:'post',
            dataType:'json',
            data:{
                'type':type,
                'startTime':startTime,
                'endTime':endTime
            },
            beforeSend:function(XH){
                $("#pay-type-loading-box").removeClass("hide");
                return true;
            },
            success:function (result) {
                initOrderPayTypeECharts(result);
                setTimeout(function () {
                    $("#pay-type-loading-box").addClass("hide");
                },300);
            }
        });
    }

    /**
     *  初始化交易支付方式 饼状图（支付宝、微信、个人账户、ios内购）
     * @param result
     */
    function initOrderPayTypeECharts(result) {
        var orderPayTypeEChart = echarts.init(document.getElementById("pay-type-statistic-box"));
        var dataList = new Array();
        var data = result.entity;
        var obj = {name:'支付宝',value:data.alipayNum};
        dataList.push(obj);
        obj = {name:'微信',value:data.weixinNum};
        dataList.push(obj);
        obj = {name:'个人账户',value:data.accountNum};
        dataList.push(obj);
        obj = {name:'ios内购',value:data.iosNum};
        dataList.push(obj);
        var option = {
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c}单 (占{d}%)"
            },
            legend: {
                x : 'center',
                y : 'top',
                data:['支付宝','微信','个人账户','ios内购']
            },
            toolbox: {
                show : true,
                feature : {
                    mark : {show: true},
                    magicType : {
                        show: false,
                        type: ['pie', 'funnel']
                    },
                    restore : {show: false},
                    saveAsImage : {show: false}
                }
            },
            calculable : true,
            series : [

                {
                    name:'交易支付方式',
                    type:'pie',
                    radius : [30, 110],
                    roseType : 'area',
                    data:dataList,
                    color:["#1890ff",
                        "#2fc25b",
                        "#fbd44b",
                        "#f4667c"]
                }
            ]
        };
        orderPayTypeEChart.setOption(option);
        $(window).resize(orderPayTypeEChart.resize);
    }

    /**
     * 交易支付渠道
     */
    function queryPayOrderFormNumData(type,startTime,endTime) {
        $.ajax({
            url: baseloaction + '/admin/stat/queryPayOrderFormNumData',
            type:'post',
            dataType:'json',
            data:{
                'type':type,
                'startTime':startTime,
                'endTime':endTime
            },
            beforeSend:function(XH){
                $("#order-form-loading-box").removeClass("hide");
                return true;
            },
            success:function (result) {
                initPayOrderFormECharts(result);
                setTimeout(function () {
                    $("#order-form-loading-box").addClass("hide");
                },300);
            }
        });
    }

    /**
     * 交易支付方式 饼状图 （后台开通、课程卡、PC、安卓、ios、H5、小程序）
     * @param result
     */
    function initPayOrderFormECharts(result) {
        var orderFromEChart = echarts.init(document.getElementById("order-form-statistic-box"));
        var dataList = new Array();
        var objData = result.entity;
        var obj= {name:"后台开通",value:objData.adminNum};
        dataList.push(obj);
        obj= {name:"课程卡",value:objData.couCartNum};
        dataList.push(obj);
        obj= {name:"PC",value:objData.webNum};
        dataList.push(obj);
        obj= {name:"安卓",value:objData.androidNum};
        dataList.push(obj);
        obj= {name:"IOS",value:objData.iosNum};
        dataList.push(obj);
        obj= {name:"H5",value:objData.mobileNum};
        dataList.push(obj);
        obj= {name:"小程序",value:objData.applyNum};
        dataList.push(obj);
        var option = {
            title : {
                text: '交易支付渠道',
                x:'center'
            },
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c}单(占{d}%)"
            },
            legend: {
                orient: 'vertical',
                left: 'left',
                data: ['后台开通','课程卡','PC','安卓','IOS','H5','小程序']
            },
            series : [
                {
                    name: '交易支付渠道',
                    type: 'pie',
                    radius : '55%',
                    center: ['50%', '60%'],
                    color:["#1890ff",
                        "#2fc25b",
                        "#fbd44b",
                        "#f4667c",
                        "#47D8BE",
                        "#8d7fec",
                        "#3A5FCD",
                        "#FFA54F",
                        "#30cdf0"],
                    data:dataList,
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
        orderFromEChart.setOption(option);
        $(window).resize(orderFromEChart.resize);
    }
});